<template>
  <div class="page-container-padding">
    <div class="module-title">策略配置</div>
    <div style="display: flex; margin-bottom: 16px">
      <div style="margin-right: 16px">
        <div>提示：①检查用户配置；②检查品种是否有配置过期。</div>
        <!-- 人员配置 -->
        <div>
          <div class="node-title">当前人员配置表</div>
          <div>
            <el-select
              v-model="currentUserId"
              filterable
              clearable
              remote
              size="mini"
              placeholder="输入用户名查询"
              :remote-method="getUserByName"
              :loading="userLoading"
            >
              <el-option
                v-for="user in userSelectList"
                :key="user.id"
                :value="user.id"
                :label="user.admin_name"
              />
            </el-select>
            <el-date-picker
              v-model="currentExpireDate"
              size="mini"
              style="margin-left: 6px"
              :clearable="false"
            />
            <el-button
              type="primary"
              size="mini"
              style="margin-left: 6px"
              :loading="saveLoading"
              @click="toAddUserConfig"
            >
              添加配置
            </el-button>
            <el-button
              type="success"
              size="mini"
              style="margin-left: 6px"
              :loading="queryLoading"
              @click="getUserConfig"
            >
              刷新
            </el-button>
          </div>
          <div style="margin-top: 8px">
            <el-table border stripe :data="userConfigList">
              <el-table-column prop="id" label="ID" width="70" />
              <el-table-column prop="admin_name" label="用户" />
              <el-table-column prop="expire_date" label="有效期" />
            </el-table>
          </div>
        </div>
        <!-- 品种配置 -->
        <div>
          <div class="node-title">当前品种配置表</div>
          <div>
            <el-select v-model="currentVarietyEn" filterable size="mini">
              <el-option
                v-for="v in varietyList"
                :key="v.variety_en"
                :value="v.variety_en"
                :label="v.variety_name"
              />
            </el-select>
            <el-date-picker
              v-model="varietyExpireDate"
              size="mini"
              style="margin-left: 6px"
              :clearable="false"
            />
            <el-button
              type="primary"
              size="mini"
              style="margin-left: 6px"
              :loading="saveVarietyConfigLoading"
              @click="toAddVarietyConfig"
            >
              添加配置
            </el-button>
            <el-button
              type="success"
              size="mini"
              style="margin-left: 6px"
              :loading="queryVarietyConfigLoading"
              @click="getVarietyConfig"
            >
              刷新
            </el-button>
          </div>
          <div style="margin-top: 10px">
            <el-table border stripe :data="varietyConfigList">
              <el-table-column prop="id" label="ID" width="70" />
              <el-table-column prop="variety_name" label="品种" />
              <el-table-column prop="expire_date" label="有效期" />
            </el-table>
          </div>
        </div>
      </div>
      <!-- 成功率辅助信息 -->
      <div style="margin-top: 10px">
        <div>
          <span>近</span>
          <el-input-number
            v-model="recentDays"
            size="mini"
            controls-position="right"
            style="margin: 0 6px"
            :min="1"
            @change="recentChange"
          />
          <span>天内短线策略成功率参考数据:</span>
        </div>
        <div style="margin-top: 10px">
          <div style="line-height: 24px">{{ rateTitle }}</div>
          <el-table border stripe :data="rateData">
            <el-table-column sortable prop="admin_name" label="姓名" />
            <el-table-column sortable prop="total_count" label="数量" />
            <el-table-column
              sortable
              prop="success_rate_p"
              label="成功率"
              :sort-method="rateSorted"
            />
          </el-table>
        </div>
      </div>
    </div>
    <div class="module-title">投资方案配置</div>
    <div>提示：①检查用户配置；②检查品种是否有配置过期。</div>
    <div style="display: flex">
      <div>
        <div class="node-title">当前人员配置表</div>
        <div>
          <el-select
            v-model="investUserConfig.userId"
            filterable
            clearable
            remote
            size="mini"
            placeholder="输入用户名查询"
            :remote-method="getUserByName"
            :loading="userLoading"
          >
            <el-option
              v-for="user in userSelectList"
              :key="user.id"
              :value="user.id"
              :label="user.admin_name"
            />
          </el-select>
          <el-date-picker
            v-model="investUserConfig.expireDate"
            size="mini"
            style="margin-left: 6px"
            :clearable="false"
          />
          <el-button
            type="primary"
            size="mini"
            style="margin-left: 6px"
            :loading="investUserConfig.saveLoading"
            @click="toAddInvestUserConifg"
          >
            添加配置
          </el-button>
          <el-button
            type="success"
            size="mini"
            style="margin-left: 6px"
            :loading="investUserConfig.queryLoading"
            @click="getInvestUserConfig"
          >
            刷新
          </el-button>
        </div>
        <div style="margin-top: 8px">
          <el-table border stripe :data="investUserConfig.configList">
            <el-table-column prop="id" label="ID" width="70" />
            <el-table-column prop="admin_name" label="用户" />
            <el-table-column prop="expire_date" label="有效期" />
          </el-table>
        </div>
      </div>
      <div style="margin-left: 16px">
        <div class="node-title">当前品种配置表</div>
        <div>
          <el-select
            v-model="investVarietyConfig.varietyEn"
            filterable
            size="mini"
          >
            <el-option
              v-for="v in varietyList"
              :key="v.variety_en"
              :value="v.variety_en"
              :label="v.variety_name"
            />
          </el-select>
          <el-date-picker
            v-model="investVarietyConfig.expireDate"
            size="mini"
            style="margin-left: 6px"
            :clearable="false"
          />
          <el-button
            type="primary"
            size="mini"
            style="margin-left: 6px"
            :loading="investVarietyConfig.saveLoading"
            @click="toAddInvestVarietyConfig"
          >
            添加配置
          </el-button>
          <el-button
            type="success"
            size="mini"
            style="margin-left: 6px"
            :loading="investVarietyConfig.queryLoading"
            @click="getInvestVarietyConfig"
          >
            刷新
          </el-button>
        </div>
        <div style="margin-top: 10px">
          <el-table border stripe :data="investVarietyConfig.configList">
            <el-table-column prop="id" label="ID" width="70" />
            <el-table-column prop="variety_name" label="品种" />
            <el-table-column prop="expire_date" label="有效期" />
          </el-table>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import { getRuizyVariety } from '@/api/variety'
  import { RecentlySummary } from '@/api/departmentWork/strategy'
  import {
    SaveStrategyConfig,
    GetStrategyConfig,
    SaveInvestmentConfig,
    GetInvestmentConfig,
  } from '@/api/adminRuizhi/ruizhiConfig'
  import { GetUserListByName } from '@/api/systemManage/userInfo'
  import { datetimeToStr } from '@/utils/datetimeUtils'
  export default {
    data() {
      return {
        recentDays: 90,
        rateData: [],
        rateTitle: '',
        userSelectList: [],
        userLoading: false,
        currentUserId: null,
        currentExpireDate: new Date(),
        saveLoading: false,
        queryLoading: false,
        userConfigList: [],

        varietyList: [],
        currentVarietyEn: null,
        varietyExpireDate: new Date(),
        varietyConfigList: [],
        saveVarietyConfigLoading: false,
        queryVarietyConfigLoading: false,

        investUserConfig: {
          configList: [],
          saveLoading: false,
          queryLoading: false,
          userId: null,
          expireDate: new Date(),
        },
        investVarietyConfig: {
          saveLoaidng: false,
          queryLoading: false,
          varietyEn: null,
          expireDate: new Date(),
        },
      }
    },
    mounted() {
      this.getSuccessRate()
      this.getUserConfig()
      this.getVarietyConfig()
      this.getInvestUserConfig()
      this.getInvestVarietyConfig()
      getRuizyVariety({ space: 'V02' }).then((res) => {
        this.varietyList = res.data
      })
    },
    methods: {
      // 使用名称搜索用户
      getUserByName(name) {
        if (name === '') {
          return
        }
        this.userLoading = true
        GetUserListByName(name).then((res) => {
          this.userSelectList = res.data
          this.userLoading = false
        })
      },
      getSuccessRate() {
        RecentlySummary(this.recentDays).then((res) => {
          this.rateData = res.data.data
          this.rateTitle = res.data.title
        })
      },

      recentChange(days) {
        this.getSuccessRate()
      },

      rateSorted(a, b) {
        return a.success_rate - b.success_rate
      },

      getUserConfig() {
        this.queryLoading = true
        GetStrategyConfig(1).then((res) => {
          this.userConfigList = res.data
          this.queryLoading = false
        })
      },

      toAddUserConfig() {
        const bData = {
          user_id: this.currentUserId,
          expire_date: datetimeToStr(this.currentExpireDate, true, '-'),
        }
        if (!bData.user_id) {
          this.$baseMessage('请指定用户后再添加设置!')
        }
        SaveStrategyConfig(bData).then((res) => {
          this.$baseMessage(res.msg, 'success')
          this.getUserConfig()
        })
      },

      toAddVarietyConfig() {
        const bData = {
          variety_en: this.currentVarietyEn,
          expire_date: datetimeToStr(this.varietyExpireDate, true, '-'),
        }
        if (!bData.variety_en) {
          this.$baseMessage('请指定品种后再添加设置!')
          return
        }
        SaveStrategyConfig(bData).then((res) => {
          this.$baseMessage(res.msg, 'success')
          this.getVarietyConfig()
        })
      },
      getVarietyConfig() {
        this.queryVarietyConfigLoading = true
        GetStrategyConfig(2).then((res) => {
          this.varietyConfigList = res.data
          this.queryVarietyConfigLoading = false
        })
      },

      toAddInvestUserConifg() {
        const bData = {
          user_id: this.investUserConfig.userId,
          expire_date: datetimeToStr(
            this.investUserConfig.expireDate,
            true,
            '-'
          ),
        }
        if (!bData.user_id) {
          this.$baseMessage('请指定用户后再添加设置!')
        }
        SaveInvestmentConfig(bData).then((res) => {
          this.$baseMessage(res.msg, 'success')
          this.getInvestUserConfig()
        })
      },
      getInvestUserConfig() {
        this.investUserConfig.queryLoading = true
        GetInvestmentConfig(1).then((res) => {
          this.investUserConfig.configList = res.data
          this.investUserConfig.queryLoading = false
        })
      },

      toAddInvestVarietyConfig() {
        const bData = {
          variety_en: this.investVarietyConfig.varietyEn,
          expire_date: datetimeToStr(
            this.investVarietyConfig.expireDate,
            true,
            '-'
          ),
        }
        if (!bData.variety_en) {
          this.$baseMessage('请指定品种后再添加设置!')
          return
        }
        SaveInvestmentConfig(bData).then((res) => {
          this.$baseMessage(res.msg, 'success')
          this.getInvestVarietyConfig()
        })
      },
      getInvestVarietyConfig() {
        this.investVarietyConfig.queryLoading = true
        GetInvestmentConfig(2).then((res) => {
          this.investVarietyConfig.configList = res.data
          this.investVarietyConfig.queryLoading = false
        })
      },
    },
  }
</script>
<style scoped lang="scss">
  .node-title {
    line-height: 22px;
    background-color: #eee;
    color: #f03300;
    margin: 6px 0;
  }
  .module-title {
    font-weight: 600;
    color: #349cfc;
    font-size: 15px;
    margin-bottom: 10px;
    border-left: 4px solid #f03300;
    padding: 6px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
  }
</style>
